//设置默认根路径
axios.defaults.baseURL = 'http://ajax-api.itheima.net'
const list = document.querySelector('.top');
//设置一个渲染函数
const renderList = async () => {

  const { data: res } = await axios.get('/api/category/top')

  const { data } = res

  const newArr = data.map(item => {

    return axios.get('/api/category/sub?id=' + item.id)

  })
  console.log(newArr);
  const pua = await Promise.all(newArr)
  console.log(pua);

  list.innerHTML = pua.map(({ data: item }) => {

    return `
             <li>
             <a href=" ">${item.data.name}</a>
             
             <img src="${item.data.picture}" alt="">
             <ul class="sub">
              ${item.data.children.map(item => {
      return `
             <li>
             <a href="javascript:;">
              <span>${item.name}</span>
              <img src="${item.picture}" alt="">
             </a>
             </li>
    `
    }).join('')}
   
   </ul>
   </li>
    `
  }).join('')


}
renderList()